<script setup>
import {useRouter} from "vue-router";

const router = useRouter()
const open = (url) => {
  window.open(url, 'black')
}
</script>

<template>
  <div
      class="my-auto flex flex-col justify-center min-h-full items-center text-base-100 text-4xl px-6 py-24 sm:py-32 lg:px-8">
    <p class="text-4xl font-semibold">404</p>
    <h1 class="mt-4 text-4xl font-bold text-accent tracking-tight  sm:text-5xl">{{ $t('text_404_1') }}</h1>
    <p class="mt-6 text-3xl">{{ $t('text_404_2') }}</p>
    <div class="mt-10 flex items-center justify-center gap-x-6">
      <button class="btn btn-primary sm:btn-lg" @click="router.push('/home')"><span
          class="text-base-100">{{ $t('text_404_3') }}</span></button>
    </div>
  </div>
</template>

<style scoped>

</style>